<!--<page-header [action]="phActionTpl">-->
<!--  <ng-template #phActionTpl>-->
<!--    <button (click)="add()" nz-button nzType="primary">新建</button>-->
<!--  </ng-template>-->
<!--</page-header>-->
<page-header [title]="'公司信息维护'"></page-header>
<nz-card>
  <form nz-form [nzLayout]="'inline'" class="search__form">
    <div nz-row [nzGutter]="{ md: 8, lg: 24, xl: 48, xxl: 48 }">
      <div nz-col nzMd="16" nzSm="24">
        <nz-form-item>
          <nz-form-label nzFor="no">公司名称</nz-form-label>
          <nz-form-control>
            <input nz-input [(ngModel)]="searchKey" name="searchKey" placeholder="请输入公司名称" id="searchKey" />
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col nzMd="8" nzSm="24">
        <button nz-button (click)="search()" [nzType]="'primary'" [nzLoading]="loading">查询</button>
      </div>
    </div>
  </form>
  <button nz-button (click)="add(modalContent)" [nzType]="'primary'">
    <i nz-icon nzType="plus"></i>
    <span>新建</span>
  </button>
  <nz-table #expandTable [nzData]="listOfMapData" nzTableLayout="fixed">
    <thead>
      <tr>
        <th>企业名称</th>
        <th>企业简称</th>
        <th>所属区域</th>
        <th>操作</th>
      </tr>
    </thead>
    <tbody>
      <ng-container *ngFor="let data of expandTable.data">
        <ng-container *ngFor="let item of mapOfExpandedData[data.key]">
          <tr *ngIf="(item.parent && item.parent.expand) || !item.parent">
            <td
              [nzIndentSize]="item.level! * 20"
              [nzShowExpand]="!!item.children"
              [(nzExpand)]="item.expand"
              (nzExpandChange)="collapse(mapOfExpandedData[data.key], item, $event)"
            >
              {{ item.name }}
            </td>
            <td>{{ item.shortName }}</td>
            <td>中国</td>
            <td>
              <a href="javascript:;" (click)="edit(item.key, modalContent)">编辑</a>
              <nz-divider nzType="vertical"></nz-divider>
              <a href="javascript:;">删除</a>
            </td>
          </tr>
        </ng-container>
      </ng-container>
    </tbody>
  </nz-table>
</nz-card>
<ng-template #modalContent>
  <nz-card [nzBordered]="false">
    <form nz-form [formGroup]="form" se-container="1" labelWidth="200">
      <se label="公司全称" error="请输入标题" required>
        <input nz-input formControlName="companyName" [(ngModel)]="companyName" placeholder="公司全称" />
      </se>
      <se label="公司简称" error="请输入标题" required>
        <input nz-input formControlName="companyShortName" [(ngModel)]="companyShortName" placeholder="公司简称" />
      </se>

      <se label="所在省市">
        <div class="d-flex justify-content-between">
          <nz-select
            formControlName="provinceCode"
            nzPlaceHolder="请选择省"
            [(ngModel)]="provinceCode"
            (ngModelChange)="choProvince($event)"
            required
            class="width-50 mr-sm"
          >
            <nz-option *ngFor="let p of provinces" [nzLabel]="p.name" [nzValue]="p.provinceCode"></nz-option>
          </nz-select>

          <nz-select
            formControlName="cityCode"
            [(ngModel)]="cityCode"
            nzPlaceHolder="请选择市"
            (ngModelChange)="choCity($event)"
            required
            class="width-50 mr-sm"
          >
            <nz-option *ngFor="let p of cities" [nzLabel]="p.name" [nzValue]="p.cityCode"></nz-option>
          </nz-select>

          <nz-select
            formControlName="areaCode"
            [(ngModel)]="areaCode"
            nzPlaceHolder="请选择区县"
            (ngModelChange)="choArea($event)"
            required
            class="width-50"
          >
            <nz-option *ngFor="let p of zoons" [nzLabel]="p.name" [nzValue]="p.areaCode"></nz-option>
          </nz-select>
        </div>
      </se>

      <se label="详细地址" error="详细地址" required>
        <input nz-input formControlName="companyAddress" [(ngModel)]="companyAddress" placeholder="详细地址" />
      </se>

      <se label="上级公司">
        <nz-tree-select
          formControlName="parentId"
          style="width: 250px"
          nzPlaceHolder="请选择上级公司"
          [nzExpandedKeys]="expandKeys"
          [(ngModel)]="value"
          [nzDropdownMatchSelectWidth]="true"
          [nzDropdownStyle]="{ 'max-height': '300px' }"
          [nzNodes]="company"
          [nzAsyncData]="true"
          (nzExpandChange)="onExpandChange($event)"
        >
        </nz-tree-select>
      </se>
      <se label="备注说明">
        <textarea
          nz-input
          formControlName="standard"
          [(ngModel)]="standard"
          [nzAutosize]="{ minRows: 4 }"
          placeholder="请输入衡量标准"
        ></textarea>
      </se>
    </form>
  </nz-card>
</ng-template>
